<script setup>
import { reactive, ref, onMounted } from 'vue'
import { getAllUserInfo } from "~/api"
import { useRouter } from 'vue-router'
const formData = reactive({
    pageNum: 0,
    pageSize: 20,
    orderType: 0,
    address: "",
    total: 0
})
const loading = ref(false)
const list = ref([])
const SumUSDT = ref()
const onSubmit = async () => {
    loading.value = true
    try {
        const res = await getAllUserInfo(formData);
        console.log(res)
        list.value = res.data.data.UserList
        formData.total = res.data.data.Total;
        SumUSDT.value = res.data.data.SumUSDT
    } catch (error) { }
    loading.value = false
}
const handleSizeChange = (val) => {
    formData.pageSize = val;
    formData.pageNum = 0;
    onSubmit();
}
const handleCurrentChange = (val) => {
    formData.pageNum = val - 1;
    onSubmit();
}
onMounted(() => {
    onSubmit();
})
</script>
<template>
    <div>
        <el-form ref="form" :model="formData" label-width="80px" :inline="true">
            <el-form-item label="排序">
                <el-select v-model="formData.orderType" placeholder="请选择" @change="onSubmit">
                    <el-option label="顺序" :value="0"> </el-option>
                    <el-option label="倒序" :value="1"> </el-option>
                </el-select>
            </el-form-item>
            <el-form-item label="地址">
                <el-input v-model="formData.address" placeholder="请输入地址" style="width: 360px"></el-input>
            </el-form-item>
            <el-form-item>
                <el-button type="primary" @click="onSubmit">搜索</el-button>
            </el-form-item>
        </el-form>
        <div class="total">总数：{{ SumUSDT }}</div>
        <el-table ref="multipleTable" :data="list" v-loading="loading">
            <el-table-column prop="Id" width="60" label="#"> </el-table-column>
            <el-table-column prop="Address" label="用户地址" width="200">
            </el-table-column>
            <el-table-column prop="Upline" label="上级地址" width="200">
            </el-table-column>
            <el-table-column prop="USDT" label="USDT" width="110"> </el-table-column>
            <el-table-column prop="Status" label="权限" width="110">
                <template #default="scope">
                    {{ ['允许', '不允许'][scope.row.Status] }}
                </template>
            </el-table-column>

            <el-table-column prop="TotalInvest" label="累计入金" width="110"> </el-table-column>
            <el-table-column prop="UserLevel" label="用户等级" width="110"></el-table-column>
            <el-table-column prop="InvitationCode" label="邀请码" width="110"></el-table-column>
            <el-table-column prop="DirectCount" label="有效直推" width="110"></el-table-column>
            <el-table-column prop="DownlineCount" label="社区成员" width="110">
            </el-table-column>
            <el-table-column prop="DownlineInvest" label="社区入金" width="110">
            </el-table-column>
            <el-table-column prop="DownlineLevel" label="社区等级" width="110">
            </el-table-column>
            <el-table-column prop="CreatedAt" label="注册时间" min-width="160">
            </el-table-column>
            <el-table-column fixed="right" label="操作" width="220">
                <template #default="scope">
                    <el-button type="primary" size="small" @click="$refs.direct.show(scope.row)">直推</el-button>
                    <el-button type="success" size="small" @click="$refs.record.show(scope.row)">记录</el-button>
                    <el-button type="warning" size="small" @click="$refs.status.show(scope.row)">权限</el-button>
                    <el-button type="danger" size="small" @click="$refs.addUSDT.show(scope.row)">加资产</el-button>
                    <el-button type="warning" size="small" @click="$refs.level.show(scope.row)">等级</el-button>
                </template>
            </el-table-column>
        </el-table>
        <el-pagination background layout="total, sizes, prev, pager, next, jumper" :page-size="formData.pageSize"
            :total="formData.total" @size-change="handleSizeChange" @current-change="handleCurrentChange">
        </el-pagination>
        <direct-list ref="direct" />
        <user-level ref="level" @onSubmit="onSubmit" />
        <usdt-record-list ref="record" @onSubmit="onSubmit" />
        <add-USDT ref="addUSDT" @onSubmit="onSubmit" />
        <user-status ref="status" @onSubmit="onSubmit" />


    </div>
</template>
<style lang="scss" scoped>
.el-pagination {
    padding: 15px;
    float: right;
}

.total {
    padding: 10px 0;
    font-size: 16px;
}

.el-table {
    .el-button {
        margin: 0 10px 10px 0 !important;
    }

    .el-button+.el-button {
        margin: 0 10px 10px 0 !important;
    }
}
</style>